// 通过 webpack-merge 插件 合并配置文件
// const merge = require ('webpack-merge');
//获取 webpack.common.js 文件
// const common = require ('./webpack.common.js');

//在 node.js下获取 获取路径
const path = require('path');

//引用本地 webpack 功能
const webpack = require('webpack');

//引用html-webpack-plugin 生成新的HTML模板
const HtmlWebpackPlugin = require('html-webpack-plugin');
//引用extract-text-webpack-plugin 把 CSS 分离成文件
const ExtractTextPlugin = require('extract-text-webpack-plugin');
//引用clean-webpack-plugin 打包前先清除dist文件夹
const CleanWebpackPlugin = require('clean-webpack-plugin');
//引用copy-webpack-plugin 将文件复制到指定文件夹下
const CopyWebpackPlugin = require('copy-webpack-plugin');

const UglifyJsPlugin = require('uglifyjs-webpack-plugin');

//配置需要合并的文件
const connectJs = require('./mergeConfig.json');

module.exports = {
  //定义打包入口
  entry: {
    AngularJs: connectJs.mergeJs,
    main: './frameworkCode/jsDependencies.js'
  },
  //定义输出
  output: {
    path: path.resolve(__dirname, 'dist'),
    //[name]对应的是 entry中的"app.bundle"
    filename: '[name].js'
  },
  plugins: [
    //重构首页模板
    // new HtmlWebpackPlugin({
    //   //选择重构的模板
    //   // template: './src/index.html',
    //   template: './testCode/index.html',
    //   //可以对文件重命名
    //   // filename: 'indexxxxx.html',
    //   //不插入生成的 js 文件，只是单纯的生成一个 html 文件
    //   inject: false,
    //   minify: {
    //     collapseWhitespace: false //是否压缩
    //   },
    //   hash: false //是否添加 哈希 值
    // }),
    // HMR 模块热替换
    new webpack.NamedModulesPlugin(),
    new webpack.HotModuleReplacementPlugin(),
    //重构CSS文件
    new ExtractTextPlugin('./index.css'),

    // new webpack.optimize.UglifyJsPlugin({
    //   sourceMap: true,
    //   exclude: ['AngularJs', 'vendor'],
    //   output: {
    //     comments: false
    //   },
    //   compress: {
    //     warnings: false
    //   }
    // }),

    new UglifyJsPlugin({
      "sourceMap": true,
      // "include": /\.js/,
      //"exclude": /.*\.min\.js/,
      exclude: ['AngularJs.js', 'vendor.js'],
      "uglifyOptions": {
        "sourceMap": true,
        "warnings": true,
        "compress": {
          "dead_code": false,
          "unused": false,
          "conditionals": false,
          "drop_console": true,
          "drop_debugger": true,
          "keep_fnames": true,
          "typeofs": false
        },
        "mangle": {
        },
        "output": {
          "comments": false
        },
        "toplevel": false
      }
    }),

    //抽离功能模块
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor',
      chunks: ['main', 'AngularJs']
    })
    // new CopyWebpackPlugin(
    //   [
    //     {
    //       from: 'thirdpart/abc.js',
    //       to: 'build/'
    //     }
    //   ],
    //   {
    //     ignore: [],
    //     copyUnmodified: true,
    //     debug: 'debug'
    //   }
    // )
  ],
  module: {
    rules: [
      {
        test: require.resolve('./frameworkCode/resources/js/notModuleJsFiles/big/big.js'),
        use: ['script-loader']
      },
      {
        test: require.resolve('./frameworkCode/resources/js/notModuleJsFiles/scrollbar/perfect-scrollbar.min.js'),
        use: ['script-loader']
      },
      {
        test: require.resolve('./frameworkCode/resources/js/module/chart/Chart.js'),
        use: ['script-loader']
      },
      {
        test: require.resolve('./frameworkCode/resources/js/module/file/FileSaver.js'),
        use: ['script-loader']
      },
      {
        test: require.resolve('./frameworkCode/resources/js/module/file/view/pdf.js'),
        use: ['script-loader']
      },
      {
        test: require.resolve('./frameworkCode/resources/js/module/file/view/pdf.worker.js'),
        use: ['script-loader']
      },
      //处理 html 文件
      {
        test: /\.html$/,
        use: [
          {
            loader: 'html-loader',
            options: {
              minimize: false
            }
          }
        ]
      },
      // 处理 sass 文件
      // {
      //   test: /\.scss$/,
      //   use: ExtractTextPlugin.extract({
      //     fallback: 'style-loader',
      //     use: ['css-loader?sourceMap', 'sass-loader?sourceMap']
      //   })
      // },
      {
        test: /\.scss$/,
        use: ExtractTextPlugin.extract({
          fallback: 'style-loader',
          use: [
            {
              // loader: ['css-loader?sourceMap', 'sass-loader?sourceMap'],
              loader: 'css-loader',
              options: {
                minimize: true, //css压缩
                sourceMap: true
              }
            },
            {
              // loader: ['css-loader?sourceMap', 'sass-loader?sourceMap'],
              loader: 'sass-loader',
              options: {
                minimize: true, //css压缩
                sourceMap: true
              }
            }
          ]
        })
      },
      //处理 ES6 语法
      {
        test: /\.js$/,
        loader: 'babel-loader',
        exclude: /node_modules/
      },
      //处理 图片 路径问题
      {
        test: /\.(gif|png|jpg)$/,
        // loader: 'url-loader?limit=8192&name=images/[name].[ext]',
        loader: 'url-loader?limit=1&name=images/[name].[ext]'
        // options: {
        //   publicPath: './images',
        // },
        //limit参数，代表如果小于大约4k则会自动帮你压缩成base64编码的图片,否则拷贝文件到生产目录
        //name后面是打包后的路径；
        //loader 后面 limit 字段代表图片打包限制，这个限制并不是说超过了就不能打包，而是指当图片大小小于限制时会自动转成 base64 码引用
        //上例中大于8192字节的图片正常打包，小于8192字节的图片以 base64 的方式引用。
      },

      //配置图片 用于开发环境
      {
        test: /\.(jpg|png|gif|jpeg|bmp)$/,
        use: {
          loader: 'url-loader',
          options: {
            limit: 8192 //限制图片的大小
          }
        }
      },

      //配置字体图标 用于开发环境
      {
        test: /\.(woff|woff2|svg|ttf|eot)$/,
        use: {
          loader: 'url-loader',
          options: {
            limit: 10000 //开发环境下这里足够大就可以，直接把字体图标打包到文件里，开发环境就需要单独打包了下一节会讲
          }
        }
      }
    ]
  },
  //配置 webpack-dev-server 工作选项
  devServer: {
    contentBase: path.join(__dirname, 'localFiles'),
    port: 9670,
    open: false,
    hot: true
  },
  //使用 source-map 工具 可以定位错误代码
  devtool: 'source-map'
};
